// base color
$blue: #324157;
$light-blue: #3a71a8;
$red: #c03639;
$pink: #e65d6e;
$green: #30b08f;
$tiffany: #4ab7bd;
$yellow: #fec171;
$panGreen: #30b08f;

// 默认菜单主题风格
$base-menu-color: #bfcbd9;
$base-menu-color-active: #f4f4f5;
$base-menu-background: #304156;
$base-logo-title-color: #ffffff;

$base-menu-light-color: rgba(0, 0, 0, 0.7);
$base-menu-light-background: #ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background: #1f2d3d;
$base-sub-menu-hover: #001528;

// 自定义暗色菜单风格
/**
$base-menu-color:hsla(0,0%,100%,.65);
$base-menu-color-active:#fff;
$base-menu-background:#001529;
$base-logo-title-color: #ffffff;

$base-menu-light-color:rgba(0,0,0,.70);
$base-menu-light-background:#ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background:#000c17;
$base-sub-menu-hover:#001528;
*/

$base-sidebar-width: 200px;
$base-header-height: 100px;

// ==========用于 base.scss @each中使用================================================
// 颜色
$colors: (
	"primary": #1a5cd7,
	"info-1": #4394e4,
	"info": #4b67af,
	"white": #ffffff,
	"light": #f9f9f9,
	"grey-1": #999999,
	"grey": #666666,
	"dark-1": #5f5f5f,
	"dark": #222222,
	"black-1": #171823,
	"black": #000000,
	"icon": #5cd9e8,
);

// 字体大小
$base-font-size: 0.2rem;
$font-sizes: (
	xxs: 0.1,
	//8px
	xs: 0.125,
	//10px
	sm: 0.2875,
	//12px
	md: 0.1625,
	//13px
	lg: 0.175,
	//14px
	xl: 0.2,
	//16px
	xxl: 0.225,
	//18px
	xxxl: 0.25 //20px,,,,,,,,,,,,,,,,
);

$flex-jc: (
	start: flex-start,
	end: flex-end,
	center: center,
	between: space-between,
	around: space-around,
	evenly: space-evenly,
);

$flex-ai: (
	start: flex-start,
	end: flex-end,
	center: center,
	stretch: stretch,
);
$flex-fd: (
	column: column,
	row: row,
);

//.mt-1 => margin top
//spacing
$spacing-types: (
	m: margin,
	p: padding,
);
$spacing-directions: (
	t: top,
	r: right,
	b: bottom,
	l: left,
);
$spacing-base-size: 0.5rem;
$spacing-sizes: (
	0: 0,
	1: 0.5,
	2: 1,
	3: 1.5,
	4: 2,
	5: 2.5,
);
:export {
	headerHeight: $base-header-height;
}
